<template>
	<view>
		<view class="order-content">
			<view v-if="delayDetail.reason" class="content-item">
				<text class="item-name four">申请原因：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.reason}}</view>
			</view>
			<view  v-if="delayDetail.delay" class="content-item">
				<text class="item-name four">申请时长：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.delay + '分钟'}}</view>
			</view>
			<view v-if="delayDetail.applyName" class="content-item">
				<text class="item-name four">申请人：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.applyName}}</view>
			</view>
			<view v-if="delayDetail.applyTime" class="content-item">
				<text class="item-name four">申请时间：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.applyTime}}</view>
			</view>
			<file-list v-if="delayDetail.attachments[0]" title="申请附件" :idList="delayDetail.attachments" :fileObj="delayFile" :length="imgLength"></file-list>
			<!-- <view v-if="" class="content-item">
				<text class="item-name four">申请附件：</text>
				<view style="word-break:break-all;flex: 1;">{{'123'}}</view>
			</view> -->
			<view class="content-item">
				<text class="item-name four">审批结果：</text>
				<view style="word-break:break-all;flex: 1;">{{approvalStatus[delayDetail.status]}}</view>
			</view>
			<view v-if="delayDetail.reviewerReason" class="content-item">
				<text class="item-name four">审批描述：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.reviewerReason}}</view>
			</view>
			<view v-if="delayDetail.reviewerName" class="content-item">
				<text class="item-name four">审批人：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.reviewerName}}</view>
			</view>
			<view v-if="delayDetail.dealTime" class="content-item">
				<text class="item-name four">审批时间：</text>
				<view style="word-break:break-all;flex: 1;">{{delayDetail.dealTime}}</view>
			</view>
		</view>
		<button v-if="delayDetail.status === 1" class="delay-btn" @click="handleDelay">审批</button>
	</view>
</template>

<script>
	import FileList from '@/components/my-components/fileList'
	import dayjs from 'dayjs'
	export default {
		components: {
			FileList
		},
		data() {
			return {
				imgLength: 0,
				imgItem: [],
				delayFile: {},
				approvalStatus: this.$type.approvalStatus,
				params: {
					id: null
				},
				delayDetail: null
			}
		},
		onLoad(options) {
			this.params.id = +options.id
			this.getDelayDetail()
		},
		methods: {
			getDelayDetail() {
				uni.showLoading({
					mask: true
				})
				this.$http2.post('ticketSystem/delay/info', this.params).then(res => {
					if(res.code === 10000) {
						console.log(res)
						this.delayDetail = res.data
						if (res.data.attachments[0]) {
							res.data.attachments.forEach((item, index) => {
								this.downloadFile(item, index)
							})
						}
						this.delayDetail.applyTime = this.delayDetail.applyTime && dayjs(this.delayDetail.applyTime).format('YYYY-MM-DD HH:mm:ss')
						this.delayDetail.dealTime = this.delayDetail.dealTime && dayjs(this.delayDetail.dealTime).format('YYYY-MM-DD HH:mm:ss') 
					}
				})  
			},
			downloadFile(id, index) {
				this.imgLength++
				this.$http2.post('common/file/download', {
					id
				}).then(res => {
					console.log(res)
					if (res.code === 10000) {
						this.imgItem.push(res.data.fileData)
						this.delayFile[index] = {}
						this.delayFile[index].fileData = res.data.fileData
						// console.log(this.ticketFile)
					}
				})
			},
			handleDelay() {
				uni.navigateTo({
					url: '/ticketSystem/handleDelay/handleDelay?id=' + this.params.id
				})
			}
		}
	}
</script>

<style>

</style>
